.card-image
  display: block
  position: relative
  img
    display: block
  &.is-square,
  &.is-4x3,
  &.is-3x2
    img
      +overlay
      height: 100%
      width: 100%
  &.is-square
    padding-top: 100%
  &.is-4x3
    padding-top: 75%
  &.is-3x2
    padding-top: 66.6666%

.card-content
  padding: 20px
  .title + .subtitle
    margin-top: -20px

.card-footer
  background: $background
  display: block
  padding: 10px

.card
  background: white
  box-shadow: 0 2px 3px rgba(black, 0.1), 0 0 0 1px rgba(black, 0.1)
  max-width: 100%
  position: relative
  width: 300px
  .media:not(:last-child)
    margin-bottom: 10px
  &.is-rounded
    border-radius: 5px
